<div class="well" 
	xmlns:th="http://www.thymeleaf.org">

	<form class="form-horizontal" action="#" th:action="@{/savelead}"
		name="saveleadform" id="saveleadform" th:object="${lead}"
		method="post">


		<h4>New Lead</h4>

		<div class="alert alert-success" th:if="${lead.id !=null}">
			<strong>Well done!</strong> You successfully read this important
			alert message.
		</div>


		<div class="form-actions">
			<button type="submit" class="btn btn-primary">Save</button>
			<button type="button" class="btn">Cancel</button>
		</div>

		<div class="row-fluid">

			<div class="span4">
				<div class="control-group"
					th:class="${#fields.hasErrors('firstName')}? 'control-group error'">
					<label class="control-label" for="firstName">First Name</label>
					<div class="controls">
						<input type="text" th:field="*{firstName}"
							placeholder="First Name"></input> <span class="help-inline error"
							th:if="${#fields.hasErrors('firstName')}"
							th:errors="*{firstName}">First Name is required.</span>
					</div>
				</div>
			</div>

			<div class="span4">
				<div class="control-group">
					<label class="control-label" for="lastName">Last Name</label>
					<div class="controls">
						<input type="text" placeholder="Last Name" th:field="*{lastName}"></input>
						<span class="help-inline" th:if="${#fields.hasErrors('lastName')}"
							th:errors="*{lastName}">Last Name is required.</span>

					</div>
				</div>
			</div>
		</div>


		<div class="row-fluid">
			<div class="span4">
				<div class="control-group">
					<label class="control-label" for="opportunityAmount">Opportunity
						Amount</label>
					<div class="controls">
						<input type="text" placeholder="Opportunity Amount"
							th:field="*{opportunityAmount}"></input> <span
							class="help-inline"
							th:if="${#fields.hasErrors('opportunityAmount')}"
							th:errors="*{opportunityAmount}">Must be a valid amount.</span>
					</div>
				</div>
			</div>

			<div class="span4">
				<div class="control-group">
					<label class="control-label" for="converted">Converted</label>
					<div class="controls">
						<input type="checkbox" disabled="true" th:field="*{converted}"></input>
					</div>
				</div>
			</div>
		</div>

		<div class="row-fluid">
			<div class="span4">
				<div class="control-group">
					<label class="control-label" for="email">Email</label>
					<div class="controls">
						<div class="input-prepend">
							<input type="text" placeholder="Email" th:field="*{email}"></input>
							<span class="add-on"><i class="icon-envelope"></i></span>
						</div>
					</div>
				</div>
			</div>

			<div class="span4">
				<div class="control-group">
					<label class="control-label" for="mobile">Mobile</label>
					<div class="controls">
						<input type="text" placeholder="Mobile" th:field="*{mobile}"></input>
					</div>
				</div>
			</div>
		</div>




		<div class="row-fluid">
			<div class="span4">
				<div class="control-group">
					<label class="control-label" for="workPhone">Work Phone</label>
					<div class="controls">
						<input type="text" placeholder="Work Phone"
							th:field="*{workPhone}"></input>
					</div>
				</div>
			</div>

			<div class="span4">
				<div class="control-group">
					<label class="control-label" for="fax">Fax</label>
					<div class="controls">
						<input type="text" placeholder="Fax" th:field="*{fax}"></input>
					</div>
				</div>
			</div>
		</div>

		<div class="row-fluid">
			<div class="span8">
				<div class="control-group">
					<label class="control-label" for="description">Description</label>
					<div class="controls">

						<textarea rows="4" cols="20" placeholder="Description"
							th:field="*{description}"></textarea>
					</div>
				</div>
			</div>
		</div>


		<hr></hr>
		<h5>Address</h5>



		<div class="row-fluid">
			<div class="span4">
				<div class="control-group">
					<label class="control-label" for="city">City</label>
					<div class="controls">

						<input type="text" id="city" placeholder="City"
							th:field="*{address.city}"></input>
					</div>
				</div>
			</div>

			<div class="span4">
				<div class="control-group">
					<label class="control-label" for="country">Country</label>
					<div class="controls">
						<input type="text" id="country" placeholder="country"
							th:field="*{address.country}"></input>
					</div>
				</div>
			</div>
		</div>


		<div class="row-fluid">
			<div class="span4">
				<div class="control-group">
					<label class="control-label" for="postcode">Post Code</label>
					<div class="controls">

						<input type="text" id="postcode" placeholder="Post Code"
							th:field="*{address.postcode}"></input>
					</div>
				</div>
			</div>

			<div class="span4">
				<div class="control-group">
					<label class="control-label" for="state">State</label>
					<div class="controls">
						<input type="text" id="state" placeholder="State"
							th:field="*{address.state}"></input>
					</div>
				</div>
			</div>
		</div>



		<div class="row-fluid">
			<div class="span8">
				<div class="control-group">

					<label class="control-label" for="street">Street</label>
					<div class="controls">

						<textarea rows="4" cols="60" placeholder="Street"
							th:field="*{address.street}"></textarea>
					</div>
				</div>

			</div>
		</div>


		<div class="form-actions">
			<button type="submit" class="btn btn-primary">Save</button>
			<button type="button" class="btn">Cancel</button>
		</div>
	</form>
</div>

